<template>
    <div class="smallsinger" @click="gogs">
        <div class="smallimg">
            <img v-lazy="mysrc" alt="">
        </div>
        <div class="smallname">{{myname}}</div>
    </div>
</template>
<script>
export default {
    name:"smallsinger",
    props:['mysrc','myname','myid'],
    data(){
        return {

        }
    },
    methods:{
        gogs(){
            this.$router.push({path:'/singer',query:{id:this.myid}})
        }
    },
}
</script>
<style lang="less" scoped>
.smallsinger{
    height:80px;
    width:80px;
    .smallimg{
        margin:0 auto;
        width:60px;
        height:60px;
        font-size:0px;
        border-radius:50%;
        overflow:hidden;
        img{
            width:100%;
        }
    }
    .smallname{
        text-align: center;
        margin-top:-10px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        background: white;
    }
}
</style>